import Vue from 'vue';
import LocalStorage from '@/cookie/local.storage';
import Router from 'vue-router';
import Start from '@/components/start';
import Video from '@/components/video';
import Auth from '@/components/modules/auth/auth';
import Comment from '@/components/modules/comment/comment';
import CreateContact from '@/components/modules/contact/create.contact';
import CommentDetail from '@/components/modules/comment/comment.detail';
import Home from '@/components/modules/home/home';
import Credit from '@/components/credit';
import Main from '@/components/modules/main/main';
import Menu from '@/components/menu';
import Search from '@/components/search';
import Profile from '@/components/modules/home/profile';
import NotFound from '../components/not.found';
import ServerError from '../components/server.error';
import Loading from '../components/loading';

Vue.use(Router);

const router = new Router({
  mode: 'hash', // history
  scrollBehavior: () => ({ y: 0 }),
  routes: [
    {
      path: '/404',
      name: 'NotFound',
      component: NotFound,
    },
    {
      path: '/50x',
      name: 'ServerError',
      component: ServerError,
    },
    {
      path: '/loading',
      name: 'Loading',
      component: Loading,
    },
    {
      path: '/',
      name: 'Start',
      component: Start,
    },
    {
      path: '/auth',
      name: 'Auth',
      component: Auth,
    },
    {
      path: '/home',
      name: 'Home',
      component: Home,
      meta: {
        requiresAuth: true,
      },
    },
    {
      path: '/main',
      name: 'Main',
      component: Main,
      meta: {
        keepAlive: false,
      },
    },
    {
      path: '/credit',
      name: 'Credit',
      component: Credit,
      meta: {
        requiresAuth: true,
      },
    },
    {
      path: '/comment',
      name: 'Comment',
      component: Comment,
      meta: {
        requiresAuth: true,
      },
    },
    {
      path: '/comment/:commentId',
      name: 'CommentDetail',
      component: CommentDetail,
      meta: {
        requiresAuth: true,
      },
    },
    {
      path: '/menu',
      name: 'Menu',
      component: Menu,
    },
    {
      path: '/search',
      name: 'Search',
      component: Search,
      meta: {
        requiresAuth: true,
      },
    },
    {
      path: '/create.contact',
      name: 'CreateContact',
      component: CreateContact,
      meta: {
        requiresAuth: true,
      },
    },
    {
      path: '/profile/:profileId',
      name: 'Profile',
      component: Profile,
      meta: {
        requiresAuth: true,
      },
    },
    {
      path: '/video',
      name: 'Video',
      component: Video,
    },
  ],
});

router.beforeEach((to, from, next) => {
  if (to.matched.length === 0) { // vue-router 没有匹配到路由的时候跳转页面,紧急跳转到服务器页面上去然后再路由到本地
    next({
      name: 'NotFound',
      query: {
        redirect: '/main',
      },
    });
  } else if (to.matched.some(record => record.meta.requiresAuth)) {
    // if (Store.state.token) {  // 通过vuex state获取当前的token是否存在
    // const token = getCookie('token');
    const local = LocalStorage.fetch('auth');
    if (local && local.accessToken) {
      next();
    } else {
      next({
        path: '/auth',
        query: {
          redirect: to.fullPath,
        },
      });
    }
  } else {
    next();
  }
});

export default router;
